<template>
  <div id="map" ref="map">
    <layerContorl :map="map" v-show="isShowlayerContorl" :ishiddenConference="ishiddenConference"/>
  </div>
</template>

<script>
import layerContorl from './component/layer-contorl.vue'
import * as mapUtils from './mapUtils'
export default {
  components: { layerContorl },
  props: {
    ishiddenConference: {
      type: Boolean,
      default: false
    },
    isShowlayerContorl: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      map: null
    }
  },
  created() {
  },
  mounted() {
    this.$nextTick(() => {
      mapUtils.initMap('map')
      this.map = mapUtils.getMap()
    })
  },
  destroyed() {
    // if (this.map) {
    //   // 存在旧地图实例
    //   this.map.getView().setZoom(0) // 将缩放级别设置为 0
    //   this.map.setTarget(null) // 解除 DOM 元素的绑定
    //   this.map.dispose() // 销毁地图实例
    //   // 可能需要根据 mapOl 的文档调用相应的销毁方法
    //   // this.map.destroy()
    //   this.map = null
    // }
  },
  methods: {}
}
</script>

<style lang="scss" scoped>
#map{
  width: 100%;
  height: 100%;
  position: relative;
}
</style>
